<template>
  <scroll-view scroll-y="true">
    <div class="page">
      <div class="section pitch_sm last-pitch_clear p_default">
        <div class="align-items_center">
          <div>
            <u--image
              shape="circle"
              width="2rem"
              height="2rem"
              :src="good.avatar"
            />
          </div>
          <div class="flex px_sm">
            <p class="username">{{ good.username }}</p>
          </div>
        </div>
        <div class="">
          <div class="price h3 align-items_center">
            <small class="dollar">¥</small>{{ good.price
            }}<small class="unit" v-if="good.unit">/{{ good.unit }}</small>
          </div>
        </div>
        <div class="row">{{ good.description }}</div>
        <div class="row">
          <u--image
            v-for="item in good.pictures"
            :key="item"
            width="100%"
            :src="item"
          />
        </div>
      </div>
    </div>
    <div class="footer-bar px_sm py_xs">
      <div class="align-items_center justify_between">
        <div></div>
        <div class="align-items_center btn-group">
          <div>
            <u-button
              class="mx_sm"
              type="primary"
              size="small"
              shape="circle"
            
              >审核通过</u-button
            >
          </div>
          <div>
            <u-button
              type="primary"
              size="small"
              shape="circle"
             
              >审核不通过</u-button
            >
          </div>
        </div>
      </div>
    </div>
  </scroll-view>
</template>

<script>
import { getGood } from '@/api/good.api';
import { navigate } from '../../service/navigate';
export default {
  data() {
    return {
      good: {},
    };
  },
  methods: {
    navigate(value) {
      console.log(value)
      navigate(value);
    },
  },
  onLoad(id) {
    getGood(Number(id)).then(({ result }) => {
      this.good = result;
    });
  },
};
</script>

<style lang="scss" scoped>
@import '@/static/variables.scss';
.page {
  margin-bottom: 50px;
}
.price {
  font-weight: bold;
  color: #ff4f24;
  .dollar {
    font-size: 12px;
  }
  .unit {
    font-size: 14px;
  }
}

.footer-bar {
  position: fixed;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9;
  height: 50px;
  box-sizing: border-box;
  background: $white-color;
  border-top: solid 1px map-get($border-colors, default);
}

.btn-group {
  gap: 12px;
}
</style>

